<template>
  <div id="index">
    <Container :imgUrl="imgUrl" :content="content" :getDatas="getDatas" :mapCenter="mapCenter"></Container>
    <pics :imgShow="imgShow" :contentShow="contentShow" :getIndex="getIndex"></pics>
  </div>
</template>

<script>
import Container from './container/Container'
import Pics from './pics/Pics'
export default {
  name: 'Index',
  components: {Pics, Container},
  data () {
    return {
      imgs: [
        '/static/img/geziwo.872c483.jpg',
        '/static/img/biluota.19caba5.jpg',
        '/static/img/lianfengshan.d53c3c6.jpg',
        '/static/img/laohuhsi.8989de8.jpg',
        '/static/img/guailou.29dc684.jpg',
        '/static/img/yeshegn.fc972a3.jpg',
        '/static/img/xinao.03bd877.jpg',
        '/static/img/nandaihe.5e3d09c.jpg',
        '/static/img/weilan.5da0623.jpg',
        '/static/img/qiuxianruhai.183fad9.jpg',
        '/static/img/ledao.ab1648d.jpg',
        '/static/img/diyiguan.5edce79.jpg',
        '/static/img/laolongtou.313ebbb.jpg',
        '/static/img/zushan.0b6b6e8.jpg',
        '/static/img/yansehu.2f5e832.jpg',
        '/static/img/jiaoshan.9f5c458.jpg'
      ],
      imgUrl: '/static/img/geziwo.872c483.jpg',
      contents: [
        '鸽子窝公园（又称鹰角公园）位于北戴河海滨的东北角，毗邻滨海大道，是秦皇岛市北戴河风景名胜区四大景区之一。在鸽子窝观日出时还常常可见到“浴日”的奇景。',
        '北戴河碧螺塔酒吧公园为秦皇岛市北戴河区AAAA级景区，位于北戴河海滨小东山，主建筑碧螺塔为海滨东山地区最高点，它是世界独一无二的海螺形螺旋观光塔。',
        '联峰山公园，又称莲蓬山公园。公园始建于1919年，是北戴河最大的森林公园，以登山揽胜、林中探幽，寻史访踪，氧吧洗肺为特点，原有的地形地貌和植被保存完好，因毗邻大海，林中负离子含量极高，1954年中央看中联峰山，在此建立了避暑疗养地。',
        '老虎石海上公园位于北戴河风景区中心。这里，巨石延伸入海，形如群虎盘踞，故名老虎石。老虎石浴场是北戴河海滨的中心浴场，这里滩宽海阔，入海坡度平缓，水质良好，因而成为暑期海浴人数最多的浴场。',
        '怪楼奇园座落于北戴河海滨百花山上，为北戴河风景名胜区的主要景区之一。1991年，根据美国园林学博士辛伯森于20世纪30年代在北戴河建造的奇异别墅（怪楼），易地重建，园名由我国著名漫画家华君武所题。',
        '秦皇岛野生动物园建于秦皇岛和北戴河之间的海滨国家森林公园内，园内放养着来自国内外的150余种7000余头（只）动物。园内共分为笼养区、猛兽区、非洲动物区、草食动物区、涉禽园、雉鸡园、孔雀园、游禽湖等八个动物展区。',
        '秦皇岛新澳海底世界由中国与澳大利亚双方合资兴建而成，是集科普教育、观赏娱乐为一体，以展示海洋生物为主的大型综合性博览馆。它引进国际最先进的设备和水族管理技术，将娱乐休闲业提高到了一个崭新的领域：并以促进秦皇岛科普教育事业作为本企业的发展宗旨。',
        '南戴河海滨旅游区是一个进行海浴、沙浴、日光浴的理想的天然佳境，这里滩宽和缓，潮汐平稳，水温适度；海底沙细柔软，无礁石碎块，无污泥烂草；海水清澈透明，无污染。在此人们可以观赏到日出奇观，领略海滩夜色的浪漫之美。',
        '远洋蔚蓝海岸项目是远洋在北戴河打造的大型文旅综合体，总占地4500亩，项目位于北戴河新区中心位置，拥有万豪度假酒店、国际学校、航海基地等国际生活配套。',
        '秦皇求仙入海处位于河北省秦皇岛市海港区东南部，据《史记·秦始皇本纪》记载，秦始皇于公元前215年东巡碣石——秦皇岛，并在此拜海，先后派卢生、侯公、韩终等两批方士携童男童女入海求仙，寻求长生不老药。明宪宗成化13年，立“秦皇求仙入海处”石碑一座，以纪圣境。',
        '山海关欢乐海洋公园位于全国旅游胜地之一秦皇岛市山海关区龙海大道南侧，是经过3年精心打造建成的一座超大型海洋公园；也是以蓝天、碧海、绿树、金沙为依托；集观赏、娱乐、休闲、动态刺激、运动参与及科普教育于一体的高档次环保生态型主题公园。',
        '山海关，又称榆关、渝关、临闾关，位于河北省秦皇岛市东北15千米处，是明长城的东北关隘之一，在1990年以前被认为是明长城东端起点，素有中国长城“三大奇观之一”（东有山海关、中有镇北台、西有嘉峪关）、“天下第一关”、“边郡之咽喉，京师之保障”之称。',
        '老龙头景区位于山海关城南5公里的临海高地上，自身形成半岛伸入渤海之中。这座呷角高地，海拔25米，依山襟海，长城耸峙海岸。',
        '祖山位于秦皇岛青龙县境内，由于渤海以北、燕山以东诸峰都是由它的分支绵延而成，故以“群山之祖”命名。其最高峰天女峰，海拔1428米，略逊于泰山。登上天女峰，东观日出，南追帆影，西望长城，北俯群山，美景尽收眼底',
        '堰塞湖是由火山熔岩流，冰碛物或由地震活动使山体岩石崩塌下来等原因引起山崩滑坡体等堵截山谷，河谷或河床后贮水而形成的湖泊。由火山熔岩流堵截而形成的湖泊又称为熔岩堰塞湖。',
        '角山长城距古城山海关北约3公里，系燕山余脉，是关城北山峦屏障的最高峰，海拔519米。其峰为大平顶，平广可坐数百人，有巨石嵯峨，好似龙首戴角，故名。角山景点，主要有角山长城、敌台、角山寺、瑞莲捧日。'
      ],
      content: '鸽子窝公园（又称鹰角公园）位于北戴河海滨的东北角，毗邻滨海大道，是秦皇岛市北戴河风景名胜区四大景区之一。在鸽子窝观日出时还常常可见到“浴日”的奇景。',
      mapCenter: [119.51962, 39.888171],
      itemIndex: 0,
      data: []
    }
  },
  methods: {
    imgShow (index) {
      this.imgUrl = this.imgs[index]
    },
    contentShow (index) {
      this.content = this.contents[index]
    },
    getIndex (index) {
      this.itemIndex = index
      let arr = this.data[index].position.split(',')
      this.mapCenter = arr.map(Number)
      // console.log(this.data[index].position)
      // console.log(this.mapCenter)
    },
    getDatas (value) {
      this.data = value
      // this.mapCenter = this.value[this.itemIndex].position
      // console.log(this.data)
    }
  }
}
</script>

<style scoped>

</style>
